<template>
	<view class="orgInfo">
		<view class="form-wrapper">
			<view class="item">
				<view class="label">
					主体类型
				</view>
				<view class="value">
					<view style="text-align: right;">
						{{ orgTypeList[form.subjectType - 1] }}
					</view>
				</view>
			</view>
			<view class="item upload-wrapper" style="padding: 20rpx 32rpx;">
				<view class="label">
					营业执照
				</view>
				<view class="value" style="justify-content: flex-end;">
					<view class="upload-wrapper">
						<view class="upload" @click="upload(1)">
							<image v-if="!form.businessLicenseImage" class="uImage"
								src="https://cdpresources.hobon.cc/supplier-mini-program/static/license.jpg"
								mode="aspectFill"></image>
							<image v-else class="uImage" :src="form.businessLicenseImage" mode="aspectFill"></image>
							<view class="example" v-if="!form.businessLicenseImage">样例</view>
							<view class="upload-btn">
								点击{{ form.businessLicenseImage ? '更改':'上传' }}营业执照
							</view>
						</view>
					</view>
				</view>
			</view>
			<view class="item">
				<view class="label">
					主体全称
				</view>
				<view class="value">
					<input type="text" v-model="form.subjectName" placeholder="请输入" class="input">
				</view>
			</view>
			<view class="item">
				<view class="label">
					统一社会信用代码
				</view>
				<view class="value">
					<input type="text" v-model="form.creditCode" placeholder="请输入" class="input">
				</view>
			</view>
			<view class="item">
				<view class="label">
					法人代表
				</view>
				<view class="value">
					<input type="text" v-model="form.corporateRepresentative" placeholder="请输入" class="input">
				</view>
			</view>
			<view class="item">
				<view class="label">
					经营期限
				</view>
				<view class="value">
					<uni-datetime-picker placeholder="开始日期" :border="false" type="date" :clear-icon="false"
						v-model="form.businessStart" />
					<text style="margin: 0 20upx 0 0px;">至</text>
					<uni-datetime-picker placeholder="结束日期" :border="false" type="date" :clear-icon="false"
						v-model="form.businessEnd" />
				</view>
			</view>

			<view class="item">
				<view class="label">
					注册地址
				</view>
				<view class="value">
					<textarea type="text" v-model="form.registrationAddress" placeholder="请输入注册地址"
						class="input"></textarea>
				</view>
			</view>
		</view>
		<view class="tip-wrapper">
			<view class="">
				请确认以上信息的准确性，一旦提交不支持修改，信息不准确将导致银行被驳回。
			</view>
		</view>
		<view class="btn" @click="submit">
			确认
		</view>
	</view>
</template>

<script>
	//import api from '@/api/requestForNvue.js'
	import {
		pathToBase64
	} from 'image-tools'

	export default {
		data() {
			return {
				form: {
					supplierId: '',
					subjectType: '',
					subjectName: '',
					registrationAddress: '',
					creditCode: '',
					corporateRepresentative: '',
					businessStart: '',
					businessEnd: '',
					businessLicenseImage: '',
				},
				orgTypeList: ['', '企业', '个体户'],
				disabled: false
			}
		},
		computed: {

		},
		onLoad(option) {
			const supplierSubject = JSON.parse(option.info);
			if (supplierSubject) {
				this.form = {
					id: supplierSubject.id,
					supplierId: supplierSubject.supplierId,
					subjectType: supplierSubject.subjectType,
					subjectName: supplierSubject.subjectName,
					registrationAddress: supplierSubject.registrationAddress,
					creditCode: supplierSubject.creditCode,
					corporateRepresentative: supplierSubject.corporateRepresentative,
					businessStart: supplierSubject.businessStart,
					businessEnd: supplierSubject.businessEnd,
					businessLicenseImage: supplierSubject.businessLicenseImage,
				}
			}
		},
		methods: {
			openPic(index) {
				const urls = [this.form.businessLicenseImage]
				uni.previewImage({
					urls: urls,
					current: index
				});
			},
			async upload(type) {
				let _this = this;
				uni.chooseImage({
					count: 1, //默认9
					sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图，默认二者都有
					//sourceType: ['album'], //从相册选择
					success: async function(res) {
						const url = await _this.$uploadFn(res.tempFilePaths[0], 0, 'license', 0, true,
							false);
						_this.form.businessLicenseImage = url;
						_this.getLicenseInfo(res.tempFilePaths[0])
					}
				});
			},
			async getLicenseInfo(path) {
				const base64 = await pathToBase64(path);
				plus.io.resolveLocalFileSystemURL(path, function(entry) {
					entry.remove(function(e) {
						console.log("删除成功");
					}, function(e) {
						console.log("删除失败");
					});
				});
				const data = await this.$api.post('/adm/ocr', {
					ocrImgData: base64.replace('data:image/jpeg;base64,', ''),
					ocrType: 1
				})
				if (data.code === 200) {
					const info = JSON.parse(data.data)
					const date = info.Period.split('至')
					if (date.length && date[0]) {
						this.form.businessStart = date[0].replace('年', '-').replace('月', '-').replace('日', '')
					}
					if (date.length && date[1] && date[1] != '长期') {
						this.form.businessEnd = date[1].replace('年', '-').replace('月', '-').replace('日', '')
					}
					this.form.subjectName = info.Name;
					this.form.creditCode = info.RegNum;
					this.form.registrationAddress = info.Address;
					this.form.corporateRepresentative = info.Person;
				} else {
					uni.showToast({
						title: data.msg,
						icon: 'none',
						duration: 2500
					})
				}
			},
			async submit() {
				if (this.disabled) return
				if (!this.form.businessLicenseImage) {
					uni.showToast({
						title: '请上传营业执照',
						icon: 'none'
					})
					return
				}
				if (!this.form.subjectName) {
					uni.showToast({
						title: '请输入主体全称',
						icon: 'none'
					})
					return
				}
				if (!this.form.creditCode) {
					uni.showToast({
						title: '请输入社会统一信用代码',
						icon: 'none'
					})
					return
				}
				if (!this.form.corporateRepresentative) {
					uni.showToast({
						title: '请输入法人代表',
						icon: 'none'
					})
					return
				}
				if (!this.form.businessStart) {
					uni.showToast({
						title: '请选择经营期限',
						icon: 'none'
					})
					return
				}
				if (!this.form.registrationAddress) {
					uni.showToast({
						title: '请输入注册地址',
						icon: 'none'
					})
					return
				}
				this.disabled = true;
				let data;
				const infoData = {
					...this.form
				}
				if (infoData.supplierId) {
					if (infoData.id) {
						data = await this.$api.put('/adm/supplier-subject', infoData)
					} else {
						data = await this.$api.post('/adm/supplier-subject', infoData)
					}
				}
				var pages = getCurrentPages();
				var prevPage = pages[pages.length - 2];
				if (prevPage == undefined || prevPage == null) return;
				prevPage.$vm.setOrgData(infoData);
				uni.navigateBack()
			},
		},
		components: {

		}
	}
</script>

<style lang="scss" scoped>
	.orgInfo {
		height: 100%;
		overflow: auto;
		padding-bottom: 180rpx;

		.form-wrapper {
			margin: 20upx;
			border-radius: 20upx;
			overflow: hidden;

			.item {
				min-height: 98upx;
				display: flex;
				align-items: center;
				justify-content: space-between;
				background-color: #ffffff;
				border-top: 2upx solid #efefef;
				padding: 0upx 32upx;
				box-sizing: border-box;

				.label {
					color: #2B2B2B;
					margin-right: 40upx;
				}

				.value {
					flex: 1;
					display: flex;
					align-items: center;
					justify-content: flex-end;

					.input {
						width: 100%;
						text-align: right;
						height: 68upx;
					}

					.upload-wrapper {
						text-align: center;
					}

					.upload {
						position: relative;
						width: 312upx;
						height: 212upx;
						border-radius: 20upx;
						margin-top: 40upx;
						background-color: #F5F6FA;
						box-shadow: 0 0 10upx 0 #cecece;
						overflow: hidden;

						&:first-child {
							margin-right: 16upx;
						}

						.uImage {
							width: 312upx;
							height: 212upx;
						}

						.example {
							position: absolute;
							left: 50%;
							top: 44%;
							transform: translate(-50%, -50%);
							color: #ff8127;
							font-size: 36upx;
						}

						.upload-btn {
							position: absolute;
							width: 100%;
							bottom: 0upx;
							left: 0;
							height: 52upx;
							background-color: #555BFF;
							display: flex;
							align-items: center;
							justify-content: center;
							color: #ffffff;
							font-size: 28upx;
						}
					}

					.tip {
						text-align: center;
						font-size: 28upx;
						color: #5B5B5B;
						margin-top: 20upx;
					}
				}

				&.upload-wrapper {
					display: block;

					.value {
						justify-content: center;
					}
				}
			}
		}

		.statement {
			margin: 40upx 32upx;
			font-size: 26upx;
			line-height: 36upx;

			.title {
				color: #2B2B2B;
			}

			.content {
				color: #5B5B5B;
				text-indent: 2em;
			}
		}

		.btn {
			position: fixed;
			bottom: 0;
			left: 0;
			width: 100%;
			height: 98upx;
			display: flex;
			align-items: center;
			justify-content: center;
			color: #ffffff;
			background-color: #555BFF;
			transition: .1s linear;

			&:active {
				background-color: #555BFFDC;
			}
		}



		.tip-wrapper {
			font-size: 26upx;
			color: #666666;
			margin: 0 32upx;
		}
	}
</style>